<template>
  <div class="box">
    <h2>2子组件</h2>
    值：<label>{{count}}</label>
    <br>
    <button @click="countSub(1)">值 -1</button>
    <button @click="countSub(5)">值 -5</button>
    <button @click="changeHandleSluggish(888)">一秒更改数值为888</button>
    <hr>
    <div>{{ filterList }}</div>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'
export default {
  methods: {
    ...mapMutations(['countSub']),
    ...mapActions(['changeHandleSluggish'])
    /*     sunCount (n) {
      this.countSub(n)
    } */
  },
  computed: {
    ...mapState(['count']),

    ...mapGetters(['filterList'])
  }
}
</script>

<style>
.box{
    border: 3px solid #ccc;
    width: 400px;
    padding: 10px;
    margin: 20px;
  }
  h2{
    margin-top: 10px;
  }
</style>
